﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>日历</title>

    <script type="text/javascript" src="/WF/Scripts/bootstrap/js/jquery.min.js"></script>
    <script type="text/javascript" src="/WF/Scripts/bootstrap/js/bootstrap.min.js"></script>
    <script src="/WF/Scripts/QueryString.js" type="text/javascript"></script>
    <script src="/WF/Scripts/config.js" type="text/javascript"></script>
    <script src="/WF/Comm/Gener.js" type="text/javascript"></script>
    <!--<base target="_self" />-->

    <link rel="stylesheet" href="/App/layuiadmin/layui/css/layui.css" media="all">
    <script src="/App/layuiadmin/layui/layui.js"></script>

    <style>
        body {
            background: #fff;
        }

        .schedule {
            margin-top: 20px;
        }

        .schedule .title {
            border-left: 2px solid #009688;
            display: inline-block;
            padding-left: 10px;
            font-weight: bold;
            font-size: 16px;
            margin-bottom: 20px;
        }
        .laydate-time-list>li:last-child {
            display: none;
            width: 0;
        }
        
        .laydate-time-list > li:not(:last-child) {
            width: 50%;
        }

        .layui-laydate-main {
            width: 220px;
        }
    </style>

</head>
<body>
    <div class="layui-container">
        <div class="schedule">
            <div class="title">新建日程</div>
            <form lay-filter="calendarForm" class="layui-form model-form">
                <input name="id" id="id" type="hidden" />
                <div class="layui-form-item">
                    <label class="layui-form-label">日程主题</label>
                    <div class="layui-input-block">
                        <input name="TB_Name" id="TB_Name" placeholder="请输入日程主题" type="text" class="layui-input" autocomplete="off"  maxlength="50" lay-verify="required" required />
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">开始</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" id="TB_DTStart" name="TB_DTStart" placeholder="年月日" autocomplete="off" lay-verify="required" required>
                    </div>
                    <div class="layui-input-inline" id="IsShow_HM">
                        <input type="text" class="layui-input" id="TB_TimeStart" name="TB_TimeStart" placeholder="HH:mm" autocomplete="off" lay-verify="required" required>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">持续</label>
                    <div class="layui-input-inline">
                        <select id="DDL_ChiXuTime" name="DDL_ChiXuTime" lay-filter="chixu">
                            <option value=""> 选择时长 </option>
                            <option value="15"> 15分钟 </option>
                            <option value="30"> 30分钟 </option>
                            <option value="60"> 1小时 </option>
                            <option value="90"> 1.5小时 </option>
                            <option value="120"> 2小时 </option>
                            <option value="150"> 2.5小时 </option>
                            <option value="180"> 3小时 </option>
                            <option value="210"> 3.5小时 </option>
                            <option value="240"> 4小时 </option>
                        </select>
                    </div>
                    <!--<div class="layui-input-inline">
                        <input type="checkbox" name="TB_IsDays" id="TB_IsDays" lay-filter="isDays" lay-skin="isDays" title="全天" value="0">
                    </div>-->
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">日程描述</label>
                        <div class="layui-input-block">
                            <textarea placeholder="请输入日程描述" name="TB_MiaoShu" id="TB_MiaoShu" class="layui-textarea" autocomplete="off"></textarea>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">位置</label>
                        <div class="layui-input-block">
                            <input name="TB_Local" id="TB_Local" placeholder="请输入位置.." type="text" class="layui-input" maxlength="400" autocomplete="off"  />
                        </div>
                    </div>

                    <div class="layui-form-item text-right">
                        <div class="layui-input-block">
                            <button class="layui-btn" lay-filter="submit" lay-submit>保存</button>                           
                        </div>
                    </div>
                </form>
        </div>
    </div>
    <script>

        layui.use(['form', 'layer', 'laydate'], function () {
            var form = layui.form, $ = layui.jquery, laydate = layui.laydate;
            var startStr = GetQueryString("startStr");
          
            
            var myDate = new Date();   
            var h = myDate.getHours();
            var m = myDate.getMinutes();
            var time = getNow(h) + ':' + getNow(m)
            

            form.on('submit(submit)', function (data) {
                
                var en = new Entity("BP.CCOA.Schedule");
                en.CopyForm();

                var DTStart = $('#TB_DTStart').val()
                var TimeStart = $('#TB_TimeStart').val()
                var TimeEnd = $('#DDL_ChiXuTime').val()

                var newDate = DTStart + ' ' + TimeStart;
                var date = new Date(newDate);

                var etime = new Date(date.getTime() + 1000 * TimeEnd * 60);
                var eh = etime.getHours();
                var em = etime.getMinutes();
                var etimeend = getNow(eh) + ':' + getNow(em)
              
                var eyear = etime.getFullYear(); //获取当前年
                var emon = etime.getMonth() + 1; //获取当前月
                var edate = etime.getDate(); //获取当前日


                var DTEnd = eyear + '-' + getNow(emon) + '-' + getNow(edate);

                en.TimeEnd = etimeend
                en.DTStart = DTStart;
                en.DTEnd = DTEnd;
                en.Insert();
                parent.location.reload();
               
            });        
            laydate.render({
                elem: '#TB_TimeStart'
                , type: 'time'
                , format: 'HH:mm'
                , ready: formatminutes
                , value: time
               // ,showBottom: false
            });
            laydate.render({
                elem: '#TB_DTStart'
                , calendar: true,
                value: startStr,
                showBottom: false   
            });


           form.on('checkbox(isDays)', function (data) {
                if (data.elem.checked) {
                    var DTStart = $('#TB_DTStart').val()
                    var TimeStart = $('#TB_TimeStart').val()
                    var TimeEnd = $('#DDL_ChiXuTime').val()

                    var newDate = DTStart + ' ' + TimeStart;
                    var date = new Date(newDate);

                    var etime = new Date(date.getTime() + 1000 * TimeEnd * 60);
                    var eh = etime.getHours();
                    var em = etime.getMinutes();
                    var timeend = getNow(eh) + ':' + getNow(em)
                    console.log(timeend);
                    var eyear = etime.getFullYear(); //获取当前年
                    var emon = etime.getMonth() + 1; //获取当前月
                    var edate = etime.getDate(); //获取当前日


                    var DTEnd = eyear + '-' + getNow(emon) + '-' + getNow(edate);
                    console.log(DTEnd);
                   // en.TimeEnd = timeend

                } 
            
            });

            function formatminutes(date) {               
                $($('.laydate-time-list li ol')[2]).find('li').remove();
            }

            function getNow(s) {
                return s < 10 ? '0' + s : s;
            }
         
        });
    </script>
</body>
</html>